<template name="cart">
	<view class="cartMainAre">
		<view class="cartAre borderR">
			<view class="display flow shopTitleAre borderB">
				<view class="display flow titleItemAre">
					<image src="/static/images/icon/shopIcon.png" style="width: 32rpx;height: 29rpx;"></image>
					<text class="shopName">{{shopList.shop_name}}</text>
					<uni-icons :type="'arrowright'" :color="'grey'" size="16" />
				</view>
			</view>
			<view class="display flow mainAre borderB" v-for="(item,index) in shopCartList" :key="index" >
				<view class="FailureAre" v-if="item.isSoldOut">
					<view class="Failure">售罄</view>
				</view>
				<view class="FailureAre" v-else-if="item.isFailure">
					<view class="Failure">失效</view>
				</view>
				<view class="checkAre" v-else>
					<view @click="selectgoods(item)">
						<uni-icons class="icon" :type="'checkbox-filled'" :color="blackColor" size="16" v-if="item.isCheck"/>
						<uni-icons class="icon" :type="'circle'" :color="'grey'" size="16" v-else/>
					</view>
				</view>
				<image :src="item.product_content.head_img" class="shopImg" @click="goodsClick(item)"></image>
				<view class="display column mainItemAre">
					<text class="fontHide" @click="goodsClick(item)">{{item.product_content.product_name}}</text>
					<text class="fontHide pColor">单位：{{item.product_content.unit}}</text>
					<view class="display flow itemAre">
						<text class="price">￥{{item.price}}</text>
						<uni-number-box :min="1" :max="item.product_content.num" :value="Number(item.num)" :list="item" @change="numChange" @inputChange="inputChange" @modifyNumber="modifyNumber"/>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default { 
		name: "cart",
		props: ['shopCartList','shopList'],
		data() {
			return {
				blackColor: this.global.blackColor
			};
		},
		methods:{
			selectshop(id){
				this.$emit('selectshop',id)
			},
			selectgoods(list){
				if(list.isSoldOut || list.isFailure){
					return
				}
				this.$emit('selectgoods',list.product_id)
			},
			modifyNumber(arr){
				console.log(arr)
				this.$emit('modifyNumber',arr)
			},
			goodsClick(list){
				if(list.isSoldOut || list.isFailure){
					return
				}
				console.log(this.global.shopId);
				let data = {
					id: list.product_id,
					disType: 1,
					shopId: this.global.shopId
				}
				uni.navigateTo({
					url: '/subPackages/shop/goodsDetails/goodsDetails?list=' + encodeURIComponent(JSON.stringify(data))
				})
			},
			numChange(value){
				console.log(value)
			},
			inputChange(value,id){
				this.$emit('inputChange',value,id)
			}
		}
	}
</script>

<style scoped lang="scss">
	@import '@/common/css/car.scss';
</style>
